<template>
	<view class="all_total">
		<view class="main">
			<view class="lists">
				<view class="title" @click="toOrder(1)">
					<text>我的订单</text>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
				<u-line></u-line>
				<view class="items" @click="toOrder(1)">
					<view class="labels">
						全部
					</view>
					<view class="values">
						{{data.my.total}}
					</view>
				</view>
				<u-line dashed></u-line>
				<view class="items" @click="toOrder(1)">
					<view class="labels">
						未完成
					</view>
					<view class="values reds">
						{{data.my.unfinished}}
					</view>
				</view>
				<u-line dashed></u-line>
				<view class="items" @click="toOrder(1)">
					<view class="labels">
						已完成
					</view>
					<view class="values greens">
						{{data.my.completed}}
					</view>
				</view>
			</view>
			<view class="lists teams">
				<view class="title" @click="toOrder(2)">
					<text>代理订单</text>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
				<u-line></u-line>
				<view class="items" @click="toOrder(2)">
					<view class="labels">
						全部
					</view>
					<view class="values">
						{{data.team.total}}
					</view>
				</view>
				<u-line dashed></u-line>
				<view class="items" @click="toOrder(2)">
					<view class="labels">
						未完成
					</view>
					<view class="values reds">
						{{data.team.unfinished}}
					</view>
				</view>
				<u-line dashed></u-line>
				<view class="items" @click="toOrder(2)">
					<view class="labels">
						已完成
					</view>
					<view class="values greens">
						{{data.team.completed}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: {
					my: {
						total: 10,
						unfinished: 10,
						completed: 10
					},
					team: {
						total: 10,
						unfinished: 10,
						completed: 10
					}
				},
				userinfo: {}
			}
		},
		onLoad() {
			this.userinfo = uni.getStorageSync('userinfo');
			this.orderCount()
		},
		methods: {
			// 跳转订单
			toOrder(type) {
				uni.navigateTo({
					url: '/pages/version5/index/shop/order/index?type=' + type
				})
			},
			// 订单统计
			async orderCount() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp5({
					url: 'Order/orderCount',
					header: {
						'token': this.userinfo.token
					}
				});
				uni.hideLoading()
				if (res.code == 1) {
					this.data = res.data
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f3f4f6;
	}
	
	.main {
		padding: 20rpx;
		.lists {
			background-color: #ffffff;
			padding: 20rpx;
			border-radius: 16rpx;
			.title {
				padding-bottom: 20rpx;
				font-weight: bold;
				display: flex;
				justify-content: space-between;
			}
			.items {
				padding: 20rpx 0;
				display: flex;
				font-size: 29rpx;
				justify-content: space-between;
				
				.values {
					font-weight: bold;
				}
				
				.reds {
					color: #fa3534;
				}
				.greens {
					color: #19be6b;
				}
			}
		}
		.teams {
			margin-top: 20rpx;
		}
	}
</style>
